.cbr-replaced {
  @size: 15px;

  position: relative;
  display: inline-block;
  vertical-align: middle;
  top: -1px;
  .user-select(none);

  .cbr-input {
    display: none;
  }

  .cbr-state {
    position: relative;
    display: block;
    background: #FFF;
    border: 1px solid @default-border-color;
    line-height: 1;
    .size(@size);

    span {
      display: block;
      background: url(../images/ok.png) no-repeat center center;
      background-image: none;
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      top: 0;
      cursor: pointer;
    }
  }

  // Checked
  &.cbr-checked {

    span {
      background-image: url(../images/ok.png);
    }
  }

  // Disabled
  &.cbr-disabled {
    .opacity(.4);
  }

  // Radio Input
  &.cbr-radio {

    .cbr-state {
      .border-radius(50%);

      span {
        background: #FFF;
        left: 2px;
        right: 2px;
        top: 2px;
        bottom: 2px;
        .border-radius(50%);
      }
    }

    &.cbr-checked .cbr-state span {
      background: @default-border-color;
    }
  }


  // Styles
  &.cbr-primary {

    .cbr-state {
      background: @brand-primary;
      border-color: @main-border-color;
    }

    &.cbr-checked {

      span {
        background-image: url(../images/ok-white-full.png);
      }
    }

    &.cbr-radio {

      .cbr-state {
        background: #fff;

        span {
          background-color: #fff;
        }
      }

      &.cbr-checked {

        .cbr-state {

          span {
            background: @brand-primary;
          }
        }
      }
    }
  }

  &.cbr-secondary {
    .xenon-cbr-style(@secondary-color);
  }

  &.cbr-success {
    .xenon-cbr-style(@brand-success);
  }

  &.cbr-info {
    .xenon-cbr-style(@brand-info);
  }

  &.cbr-danger {
    .xenon-cbr-style(@brand-danger);
  }

  &.cbr-warning {
    .xenon-cbr-style(@brand-warning);
  }

  &.cbr-red {
    .xenon-cbr-style(@xe-red);
  }

  &.cbr-blue {
    .xenon-cbr-style(@xe-blue);
  }

  &.cbr-purple {
    .xenon-cbr-style(@xe-purple);
  }

  &.cbr-pink {
    .xenon-cbr-style(@xe-pink);
  }

  &.cbr-orange {
    .xenon-cbr-style(@xe-orange);
  }

  &.cbr-turquoise {
    .xenon-cbr-style(@xe-turquoise);
  }

  &.cbr-yellow {
    .xenon-cbr-style(@xe-yellow);
  }

  &.cbr-gray {
    .xenon-cbr-style(darken(@xe-gray, 15%));

    &.cbr-checked span {
      background-image: url(../images/ok.png);
    }
  }

  + label {
    padding-left: @base-padding/2;
  }
}

label {

  .cbr-replaced {
    margin-right: 4px;
  }

  &.cbr-inline {
    padding-top: (@padding-base-vertical + 1);

    + .cbr-inline {
      margin-left: @base-padding;
    }
  }
}


.xenon-cbr-style(@background-color; @border-color: @background-color) {
  .cbr-state {
    background: @background-color;
    border-color: @border-color;

    span {
      //left: 1px; right: 1px; top: 1px; bottom: 1px;
    }
  }

  &.cbr-checked {

    span {
      background-image: url(../images/ok-white-full.png);
    }

    &.cbr-radio {

      .cbr-state {

        span {
          background: @background-color;
        }
      }
    }
  }

  &.cbr-radio {

    .cbr-state {
      background: #fff;
    }
  }
}